<template>
    <view class="container">
<!--        <view class="search">-->
<!--            <uni-search-bar @confirm="search" @input="input" bgColor="#FFF" placeholder="请输入搜索内容" ></uni-search-bar>-->
<!--        </view>-->
        <view class="list">
            <view class="item" v-for="item in page.records">
                <view class="left">
                    <image :src="item.avatar?item.avatar:Config.OSS_HOST+Config.AVATAR+'?x-oss-process=image/resize,w_100,h_100,m_fill'" class="avatar" mode="scaleToFill"></image>
                </view>
                <view class="center">
                    <view class="nickname">{{ item.nickname }}</view>
                    <view class="vip" v-if="item.vipType > 0">已开通VIP</view>
                    <view class="vip" v-else>未开通VIP</view>
                </view>
                <view class="right">
                    <view class="time">邀请时间：{{ item.createTime }}</view>
                    <view class="time2">过期时间：{{ item.vipExpiredTime }}</view>
                </view>
            </view>
        </view>
        <uni-load-more :status="status"/>
    </view>
</template>

<script>
import {UserApi} from '@/api/user/UserApi'

export default {
    data() {
        return {
			Config: this.$Config,
			Common: this.$Common,
			Auth: this.$Auth,
			ShareUtil: this.$ShareUtil,
			State: this.$store.state,
			Dict: this.$Dict,

            page: {
                total: 0,
                size: 10,
                current: 1,
                pages: 2,
                records: []
            },
            status: 'more',

        }
    },
    onLoad() {
        this.getPage()
    },
    onPullDownRefresh() {
        this.page.current = 1
        this.page.pages = 2
        this.getPage()
    },
    onReachBottom() {
        if (this.page.current !== this.page.pages) {
            this.page.current++
            this.getPage()
        }
    },
    methods: {
        getPage() {
            let that = this
            let param = {
                pageIndex: this.page.current,
                pageSize: this.page.size
            };
            that.status = 'loading'

            UserApi.getPage(param).then((response) => {
                if (that.page.current === 1) {
                    that.page = response
                } else {
                    that.page.records = that.page.records.concat(response.records)
                }

                that.page.records.forEach(function (item) {
                    item.createTime = that.Common.timeFormat(item.createTime, 2)
                    if (item.vipType === 2) {
                        item.vipExpiredTime = "永久"
                    } else {
                        item.vipExpiredTime = item.vipExpiredTime ? that.Common.timeFormat(item.vipExpiredTime, 2) : ""
                    }
                })

                if (that.page.current === that.page.pages || that.page.pages === 0) {
                    that.status = 'noMore'
                } else {
                    that.status = 'more'
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.container{}
.list{ padding:10px; font-size: 14px;}
.list .item{ display: flex; padding:10px; background: #FFF; border-radius:5px; align-items: center; margin-bottom: 10px;}
.list .item .left{ height:50px;}
.list .item .left .avatar{ width:50px; height:50px; border-radius: 25px;}
.list .item .center{ padding-left:10px; flex: 1;}
.list .item .center .nickname{ font-size:14px;}
.list .item .center .vip{ margin-top:5px; font-size:14px; color:#666;}
.list .item .right .time{ font-size:14px;}
.list .item .right .time2{ margin-top:5px;font-size:14px;}



</style>
